<template>
  <div class="home">
    <!-- 顶部 -->
    <Htop :data="this.homeInfo"></Htop>
    <div class="flex JustifyContentSB  font_20 colorF" style="margin: -1rem 2.15rem 0px;">
      <p id="weatherData"></p>
      <p>{{ `${year}/${month}/${day} ${hour}:${minutes}:${seconds}` }}</p>
    </div>

    <div class="flex" style="padding: 0 1.25rem ;box-sizing:border-box;width: 100%;">
      <!-- 左部 -->
      <Hleft style="width: 28%;" :homeInfo="this.homeInfo"></Hleft>
      <Hcenter style="width: 44%" :homeInfo="this.homeInfo"></Hcenter>
      <!-- 右部 -->
      <Hright style="width: 28%;" :homeInfo="this.homeInfo"></Hright>
    </div>
    <!-- 下部 -->
    <Hbottom :homeInfo="this.homeInfo"></Hbottom>
  </div>
</template>

<script>
import Htop from '@/views/components/Htop'
import Hleft from '@/views/components/Hleft'
import Hright from '@/views/components/Hright'
import Hcenter from '@/views/components/Hcenter'
import Hbottom from '@/views/components/Hbottom'
import eventBus from '../eventBus'

export default {
  name: 'home',
  components: {
    Htop,
    Hleft,
    Hright,
    Hcenter,
    Hbottom
  },
  data () {
    return {
      year: '',
      month: '',
      day: '',
      hour: '',
      minutes: '',
      seconds: '',
      modely1: false,
      modely2: false,
      modely101: false,
      weatherInfo: {}, // 天气情况
      homeInfo: {},
      jbjgs: ''
    }
  },
  created () {
    // 获取当前年月日，时分秒
    this.getCurrentDate()
    this.homeHandele()
    if (sessionStorage.loginName !== 'true') {
      this.$goRoute('/')
      // console.log('111')
    } else {
      // console.log('000')
    }
  },
  mounted () {
    this.gdmap()
  },
  methods: {
    // 获取当前年月日，时分秒
    getCurrentDate () {
      setInterval(() => {
        let date = new Date()
        this.year = date.getFullYear()
        this.month = date.getMonth() + 1
        this.day = date.getDate()
        this.hour = date.getHours()
        this.minutes = date.getMinutes()
        this.seconds = date.getSeconds()

        if (this.minutes >= 0 && this.minutes <= 9) {
          this.minutes = '0' + this.minutes
        }
        if (this.seconds >= 0 && this.seconds <= 9) {
          this.seconds = '0' + this.seconds
        }
      }, 1000)
    },
    gdmap () {
      let map = new AMap.Map('container', {
        resizeEnable: true,
        mapStyle: 'amap://styles/darkblue',
        zoom: 12,
        pitch: 20,
        rotation: 25,
        viewMode: '3D',
        center: [121.552556, 31.215723]
      })

      this.$root.MapGd = map
      AMap.plugin('AMap.Weather', function () {
        var weather = new AMap.Weather()
        weather.getForecast('上海市', function (err, data) {
          if (err) {
            return
          }
          var str = []
          let dayWeather = data.forecasts[0]
          str.push(dayWeather.dayWeather + '\t' + dayWeather.nightTemp + '~' + dayWeather.dayTemp + '℃')
          document.getElementById('weatherData').innerHTML = str.join('<br>')
        })
      })
    },
    homeHandele () {
      this.$http.post(this.$api.Index.index, ' ', true).then(result => {
        this.homeInfo = result.data.result
        this.jbjgs = result.data.result.jbjgs
        eventBus.$emit('homeInfoFun', this.homeInfo)
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.home {
  width: 100%;
  height: 100%;
  background: url(../assets/img/home/bg.png) no-repeat;
  background-size: 100% 100%;
}
</style>
